﻿<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Transition Button</title>

<style>
.slickButton {
  color: white;
  font-weight: bold;
  padding: 10px;
  border: solid 1px black;
  background: lightgreen;
  cursor: pointer;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

.slickButton:hover {
  color: black;
  background: yellow;
}
</style>

</head>

<body>
<button class="slickButton">Hover Here!</button>
</body>
</html>
